<template>
  <div id="basicLayout">
    <!-- <div class="layout-demo"> -->
      <a-layout style="min-height:100vh">
        <a-layout-header class="header">
          <!-- 菜单组件 -->
          <GlobalMenu />
        </a-layout-header>

        <a-layout-content class="content">
          <!-- <Carousel /> -->
          <router-view/>
        </a-layout-content>

        <a-layout-footer class="footer">
          <a href=""> 子轩OJ，用于学习的OJ项目，非商业用途 </a>
        </a-layout-footer>
      </a-layout>
    <!-- </div> -->
    
  </div>
</template>
<script>
import GlobalMenu from "@/components/GlobalMenu";
import Carousel from "@/components/Carousel";
export default {
  components: { GlobalMenu, Carousel },
};
</script>

<style scoped>
#basicLayout .header
{
  /* background-color:red; */
  margin-bottom:16px;
}
#basicLayout .content{
  background:linear-gradient(to,right,#bbb,#fff);
  margin-bottom:16px;
  
}
#basicLayout .footer {
  background-color:#efefef;
  padding: 16px;
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  text-align:center;
}
</style>
